<template>
    <div class=''>
        父组件
        <Son @change-click="change" ref="sonRef" :val='value' />
        <a-button type="primary" @click="btn">Primary Button</a-button>
        <input v-model="provideVal" value="blue" type="radio"> 蓝色
        <input v-model="provideVal" value="#9999" type="radio"> #9999
        <a-input v-model:value="value" placeholder="Basic usage" />
    </div>
</template>

<script lang='ts' setup>
import Son from './Son.vue'
type MyFunc = (a: string) => void;
import { ref, reactive, toRefs, toRaw, provide, getCurrentInstance } from 'vue';
;
// $bus用mitt
const value = ref<string>('传过去');
console.log('===>value',value);
//ref 组件定义
const sonRef = ref<InstanceType<typeof Son>>();
// provide  inject  使用
const provideVal = ref('red')
provide('provideVal', provideVal)
console.log('===>',);
// 子组件使用emit 
const change: MyFunc = (data) => {
    console.log('===>111',);
    console.log('===>', data);
    value.value = data
}
const btn = () => {
    // 拿到子组件暴露的东西
    console.log('===>', sonRef.value?.refVal);
}
</script>

<style scoped lang='less'></style>